<!doctype html>
<html class="no-js">

<head>
    <meta charset="utf-8">
    <title>钉钉JS-API demo</title>
    <meta name="description" content="">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <!-- Place favicon.ico and apple-touch-icon.png in the root directory -->
    <script type="text/javascript" src="https://g.alicdn.com/ilw/ding/0.7.5/scripts/dingtalk.js"></script>
    <link rel="stylesheet" href="/Amos_Ding/static/src/style200/css/index.css">

    <script type="text/javascript">

        var _config = {
            appId: '43044343',
            corpId: 'dinga555aa55583c4f5d35c2f4657eb6378f',
            timeStamp: '<%=timestamp%>',
            nonce: '<%=nonceStr%>',
            signature: '<%=signature%>'
        };

        //jsapi的配置。我注销之后代码仍然可正确执行。这里我没有了解到具体的函义与用法         dd.config({             appId: _config.appId,             corpId: _config.corpId,             timeStamp: _config.timeStamp,             nonceStr: _config.nonce,             signature: _config.signature,             jsApiList: ['runtime.info', 'dd.device.notification.alert',               'runtime.permission.requestAuthCode',]         });


        dd.ready(function () {

            //获取免登授权码 -- 注销获取免登服务，可以测试jsapi的一些方法             dd.runtime.permission.requestAuthCode({                 corpId: _config.corpId,                 onSuccess: function (result) {                   location.href = "ServerApi.aspx?code=" + code.code;                 },                 onFail: function (err) { }

        });


        //这里写一个简单的jsapi的弹用，其它api的调用请参照钉钉开发文档-客户端开发文档             dd.device.notification.alert({                 message: "测试弹窗",                 title: "提示",//可传空                 buttonName: "收到",                 onSuccess: function () {                     /*回调*/                 },                 onFail: function (err) { }             });

        })
        ;     </script>


</head>

<body>


<div class="well">
    <h5 class="badge">钉钉JS-API<span class="caret"></span></h5>
    <button class="btn btn-block btn-default J_method_out_btn" data-method="dd.version" data-param=''
            data-action="alert">钉钉客户端版本
    </button>
    <button class="btn btn-block btn-default J_shake" data-method="device.accelerometer.watchShake"
            data-param='{"sensitivity": 15, "frequency": 150, "callbackDelay": 1000}'>启动摇一摇
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="device.accelerometer.clearShake">停止摇一摇</button>
    <!-- <button class="btn btn-block btn-default J_method_btn" data-method="biz.user.get" data-action="alert">获取用户信息</button> -->
    <button class="btn btn-block btn-default J_method_btn" data-method="device.notification.vibrate"
            data-param='{"duration": 300}'>震动
    </button>
    <!-- <button class="btn btn-block btn-default J_method_btn" data-method="biz.util.open" data-param='{"name": "mailAttachment", "params": {"mailId": "432423", "attachmentId": "3432", "title": "test", "size": "32131"}}'>打开附件</button> -->
    <button class="btn btn-block btn-default J_method_btn" data-method="biz.util.openLink"
            data-param='{"url": "http://m.laiwang.com"}'>打开外部URL
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="biz.util.openLink"
            data-param='{"url": "http://m.laiwang.com", "enableShare": false}'>打开外部URL(enableShare: false)
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="biz.util.openLink"
            data-param='{"url": "https://www.baidu.com"}'>打开baidu
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="biz.contact.choose"
            data-param='{"multiple": true, "max": 30}' data-action="alert">选取企业通讯录[无corpId和users]
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="biz.contact.choose"
            data-param='{"multiple": true, "max": 30, "corpId": "ding4ed6d279061db5e7", "users": ["5733", "46127", "148234", "73420"]}'
            data-action="alert">选取企业通讯录[有corpId和users]
    </button>
    <button class="btn btn-block btn-default J_nav_left" data-method="biz.navigation.setLeft"
            data-param='{"control": true, "text": "取消"}'>设置左侧导航
    </button>
    <button class="btn btn-block btn-default J_method_btn J_nav_title" data-method="biz.navigation.setTitle"
            data-param='{"title": "邮箱正文"}'>设置标题
    </button>
    <button class="btn btn-block btn-default J_method_btn J_nav_title" data-method="biz.navigation.setTitle"
            data-param='{"title": ""}'>重置标题
    </button>
    <button class="btn btn-block btn-default J_nav_right" data-method="biz.navigation.setRight"
            data-param='{"control": true, "text": "发送"}'>设置右侧导航
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="biz.navigation.setRight"
            data-param='{"show": false}'>隐藏右侧导航
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="biz.navigation.back" data-param='{}'>页面后退
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="device.notification.alert"
            data-param='{"message": "亲爱的", "title": "提示", "buttonName": "收到"}'>弹窗alert
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="device.notification.confirm"
            data-param='{"message": "你爱我吗？", "title": "提示", "buttonLabels": ["爱", "不爱"]}' data-action="alert">弹窗confirm
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="device.notification.prompt"
            data-param='{"message": "再说一遍？", "title": "提示", "buttonLabels": ["继续", "不玩了"]}' data-action="alert">弹窗prompt
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="biz.util.open"
            data-param='{"name": "chat", "params": {"corpId": "ding4ed6d279061db5e7", "users": ["5733", "46127"]}}'>
        打开聊天页面
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="biz.util.share"
            data-param='{"url": "http://m.laiwang.com", "title": "支付宝新春红包节目单", "content": "新春将至，支付宝现金拜年！每天整点现金大放送，欲知详情，猛戳起来！", "image": "https://i01.lw.aliimg.com/tfs/TB1TUovHXXXXXbCXpXXNC1IYXXXLAIWANGi_1_120_120.jpg"}'>
        分享
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="biz.util.share"
            data-param='{"type": 0, "url": "http://m.laiwang.com", "title": "支付宝新春红包节目单", "content": "新春将至，支付宝现金拜年！每天整点现金大放送，欲知详情，猛戳起来！", "image": "https://i01.lw.aliimg.com/tfs/TB1TUovHXXXXXbCXpXXNC1IYXXXLAIWANGi_1_120_120.jpg"}'>
        分享(type: 0)
    </button>
    <!-- <button class="btn btn-block btn-default J_method_btn" data-method="biz.util.share" data-param='{"type": 0}'>分享(只有type: 0)</button> -->
    <button class="btn btn-block btn-default J_method_btn" data-method="biz.util.share"
            data-param='{"type": 1, "url": "http://m.laiwang.com", "title": "支付宝新春红包节目单", "content": "新春将至，支付宝现金拜年！每天整点现金大放送，欲知详情，猛戳起来！", "image": "https://i01.lw.aliimg.com/tfs/TB1TUovHXXXXXbCXpXXNC1IYXXXLAIWANGi_1_120_120.jpg"}'>
        分享(type: 1)
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="biz.util.share"
            data-param='{"type": 2, "url": "http://m.laiwang.com", "title": "支付宝新春红包节目单", "content": "新春将至，支付宝现金拜年！每天整点现金大放送，欲知详情，猛戳起来！", "image": "https://i01.lw.aliimg.com/tfs/TB1TUovHXXXXXbCXpXXNC1IYXXXLAIWANGi_1_120_120.jpg"}'>
        分享(type: 2)
    </button>
    <!-- <button class="btn btn-block btn-default J_method_btn" data-method="biz.util.share" data-param='{"type": 2}'>分享(只有type: 2 )</button> -->
    <button class="btn btn-block btn-default J_method_btn" data-method="biz.util.ut"
            data-param='{"key": "h5_ut_test_demo", "value": "123"}'>UT打点
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="biz.util.open"
            data-param='{"name": "call", "params": {}}'>钉钉免费电话
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="biz.util.open"
            data-param='{"name": "profile", "params": {"corpId": "ding4ed6d279061db5e7", "id": "5733"}}'>打开个人资料页
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="biz.util.open"
            data-param='{"name": "profile", "params": {"corpId": "ding4ed6d279061db5e7", "id": "999999"}}'>打开个人资料页(查无此人)
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="biz.util.datepicker"
            data-param='{"format": "yyyy-MM-dd"}' data-action="alert">日期选择器
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="biz.util.datepicker"
            data-param='{"format": "yyyy-MM-dd", "value": "2015-05-20"}' data-action="alert">日期选择器(有默认值)
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="biz.util.timepicker"
            data-param='{"format": "HH:mm"}' data-action="alert">时间选择器
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="biz.util.timepicker"
            data-param='{"format": "HH:mm", "value": "08:30"}' data-action="alert">时间选择器(有默认值)
    </button>
    <h5 class="badge" id="J_1">ability: 0.0.1<span class="caret"></span></h5>
    <button class="btn btn-block btn-default J_method_btn" data-method="runtime.info" data-param='{}'
            data-action="alert">容器信息
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="device.geolocation.get" data-param='{}'
            data-action="alert">获取经纬度
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="device.notification.toast"
            data-param='{"text": "发送成功"}'>toast
    </button>
    <!--<button class="btn btn-block btn-default J_method_btn" data-method="device.notification.toast" data-param='{"global": true, "text": "发送成功", "duration": 2, "delay": 0}'>toast</button>-->
    <button class="btn btn-block btn-default J_loading" data-method="device.notification.showPreloader"
            data-param='{"text": "使劲加载中..", "showIcon": true}'>显示loading
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="device.notification.hidePreloader"
            data-param='{}'>隐藏loading
    </button>
    <button class="btn btn-block btn-default J_upload" data-method="biz.util.uploadImage"
            data-param='{"multiple": false}' data-action="alert">上传图片(单图)
    </button>
    <button class="btn btn-block btn-default J_upload" data-method="biz.util.uploadImage"
            data-param='{"multiple": true}' data-action="alert">上传图片(多图)
    </button>
    <button class="btn btn-block btn-default J_upload" data-method="biz.util.uploadImage"
            data-param='{"multiple": true, "max": 3}' data-action="alert">上传图片(多图, max:3)
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="biz.util.previewImage"
            data-param='{"urls": ["//gtms01.alicdn.com/tps/i1/TB12i5PHFXXXXaKXVXXY7J9SpXX-500-699.jpeg", "http://gtms04.alicdn.com/tps/i4/TB1E4yUHFXXXXboXFXXK0qsSpXX-500-750.jpeg", "http://gtms03.alicdn.com/tps/i3/TB1Eee0HFXXXXc_XpXXL.KX0VXX-440-586.jpeg", "http://gtms02.alicdn.com/tps/i2/TB1Nn1THFXXXXbKXFXX_SFfVFXX-658-658.jpeg"], "current": "http://gtms04.alicdn.com/tps/i4/TB1E4yUHFXXXXboXFXXK0qsSpXX-500-750.jpeg"}'>
        浏览图片
    </button>
    <h5 class="badge" id="J_2">ability: 0.0.2<span class="caret"></span></h5>
    <button class="btn btn-block btn-default J_method_btn" data-method="device.connection.getNetworkType"
            data-param='{}' data-action="alert">网络类型
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="biz.util.qrcode" data-param='{}'
            data-action="alert">扫码
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="device.notification.toast"
            data-param='{"global": true, "icon": "success","text": "发送成功", "duration": 2, "delay": 0}'>toast带icon
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="device.notification.toast"
            data-param='{"global": true, "icon": "error","text": "提交失败", "duration": 2, "delay": 0}'>toast带icon[error]
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="device.notification.actionSheet"
            data-param='{"title": "谁是最棒哒？", "cancelButton": "取消", "otherButtons": ["孙悟空", "猪八戒", "唐僧", "沙和尚"]}'
            data-action="alert">actionSheet
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="device.notification.actionSheet"
            data-param='{"cancelButton": "取消", "otherButtons": ["孙悟空", "猪八戒", "唐僧", "沙和尚"]}' data-action="alert">
        actionSheet无title
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="ui.input.plain"
            data-param='{"placeholder": "请输入评论...", "text": "我是默认填充文本"}' data-action="alert">ui.input.plain
    </button>
    <h5 class="badge" id="J_2">ability: 0.0.3<span class="caret"></span></h5>
    <button class="btn btn-block btn-default J_method_btn" data-method="biz.ding.post"
            data-param='{"corpId": "ding4ed6d279061db5e7", "users": ["5733", "46127"], "type": 1, "attachment": {"images": ["http://gtms03.alicdn.com/tps/i3/TB1c3slGXXXXXbaaXXX5Oym2XXX-2880-1402.jpg_640x640xz.jpg", "http://gtms02.alicdn.com/tps/i2/TB1SlYwGFXXXXXrXVXX9vKJ2XXX-2880-1560.jpg_640x640xz.jpg"]}, "text": "图片类型的钉"}'>
        发钉(image)
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="biz.ding.post"
            data-param='{"corpId": "ding4ed6d279061db5e7", "users": ["5733", "46127"], "type": 2, "attachment": {"title": "源于关于公司三八节放假通知", "url": "http://m.laiwang.com", "image": "http://gtms02.alicdn.com/tps/i2/TB1SlYwGFXXXXXrXVXX9vKJ2XXX-2880-1560.jpg_640x640xz.jpg", "text": "放假半天"}, "text": "快说说你们放假想干啥吧"}'>
        发钉(link)
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="biz.telephone.call"
            data-param='{"corpId": "ding4ed6d279061db5e7", "users": ["5733", "46127"]}'>打电话
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="biz.chat.chooseConversation" data-param='{}'
            data-action="alert">选群组
    </button>
    <h5 class="badge" id="J_2">ability: 0.0.4<span class="caret"></span></h5>
    <button class="btn btn-block btn-default J_method_btn" data-method="biz.util.open"
            data-param='{"name": "contactAdd", "params": {}}'>拉起联系人添加页面
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="biz.util.open"
            data-param='{"name": "friendAdd", "params": {}}'>拉起添加好友页面
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="biz.contact.createGroup" data-param='{}'
            data-action="alert">创建企业群聊天[不指定corpId]
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="biz.contact.createGroup"
            data-param='{"corpId": "ding4ed6d279061db5e7", "users": ["5733", "46127", "148234", "73420"]}'
            data-action="alert">选取企业通讯录[有corpId和users]
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="biz.util.chosen"
            data-param='{"source": [{"key": "选项1", "value": 1},{"key": "选项2", "value": 2}]}' data-action="alert">下拉组件
    </button>
    <button class="btn btn-block btn-default J_method_btn" data-method="biz.util.datetimepicker"
            data-param='{"format": "yyyy-MM-dd HH:mm", "value": "2015-05-15 09:00"}' data-action="alert">日期+时间选择器
    </button>

    <h5 class="badge">系统控件<span class="caret"></span></h5>
    <h5>日期</h5>
    <input class="plain" type="date" value="2015-02-10">
    <h5>时间</h5>
    <input class="plain" type="time" value="14:58">
    <h5>日期和时间</h5>
    <input class="plain" type="datetime-local" value="2015-02-10T14:58">
    <h5>下拉菜单</h5>
    <select class="plain">
        <option value="0">请选择请假类型</option>
        <option value="1">年休假</option>
        <option value="2">路途假</option>
        <option value="3">婚假</option>
    </select>
    <h5>文件</h5>
    <input class="plain J_file" data-type="create" type="file" value="">
    <h5>电话号码</h5>
    <input class="plain" type="tel" value="">

</div>
<ul class="list-group" id="J_console">
    <!-- <li class="list-group-item">fewafewaef</li>
    <li class="list-group-item">fewafewaef</li> -->
</ul>
<button class="btn btn-block btn-default J_clear">清除日志</button>
<script src="/Amos_Ding/static/src/style200/js/vendor.js"></script>

<script>
    window.onerror = function () {
        var args = Array.prototype.slice.call(arguments);
        console.log('JS报错：', args);
    };
    $(function () {
        FastClick.attach(document.body);
    });
    var log = function () {
        var args = [].slice.call(arguments);
        args = args.map(function (item) {
            if (typeof item === 'object') {
                return JSON.stringify(item);
            } else {
                return item;
            }

        });
        var $li = $('<li class="list-group-item" />');
        var text = args.join('  ')
        $li.text(text);
        $('#J_console').append($li)
    };
    console.log = log;

    $('.J_clear').on('click', function () {
        $('#J_console').empty();
    });

    //模拟webviewjavascriptbridge
    /*0: 调用成功
     1: 接口不存在
     2: 参数无效
     3: 发生未知错误
     4: 接口无权限
     5: 调用超时*/
    //模拟WebViewJavascriptBridge
    /*window.WebViewJavascriptBridge = {
     fn: {},
     init: function(data) {
     console.log('init: ', data)
     },
     registerHandler: function(method, callback){
     console.log('registerHandler: ' + method);
     this.fn[method] = callback;
     },
     callHandler: function(method, p, fn) {
     console.log('callHandler: ', arguments);
     this.fn[method]();
     if (fn) {
     fn({
     errorCode: 1,
     errorMessage: '哈哈，错了吧'
     });
     } else {
     this.fn[method] && this.fn[method]();
     }

     }
     };*/
</script>
<!--<script src="scripts/nuva.js"></script>-->
<script src="/Amos_Ding/static/src/style200/js/dingtalk.js"></script>
<script src="/Amos_Ding/static/src/style200/js/demo.js"></script>
</body>

</html>
